<!DOCTYPE html>
<html>

<head>
    <title>北京站网格化系统</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Fonts -->
    <!-- CSS Libs -->
    <link rel="stylesheet" type="text/css" href="../lib/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/bootstrap-switch.min.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/checkbox3.min.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/jquery.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/dataTables.bootstrap.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/select2.min.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/jquery.datetimepicker.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/validform.min.css">
    <!-- CSS App -->
    <link rel="stylesheet" type="text/css" href="../lib/css/common/style.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/common/themes/flat-blue.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/common/newstyle.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/zc-common.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/baseCommon.css">
    <link rel="stylesheet" type="text/css" href="../lib/css/NGR.css">
</head>
<body class="flat-blue">
    <div class="app-container expanded">
        <div class="row content-container">
            <nav class="navbar navbar-default navbar-fixed-top navbar-top">
                <div class="container-fluid app-header">
                    <div class="navbar-header">
                        <button type="button" class="navbar-expand-toggle fa-rotate-90">
                        <i class="fa fa-bars icon"></i>
                        </button>
                        <top-nav></top-nav>
                    </div>
                    <right-info></right-info>
                </div>
            </nav>
            <div class="side-menu-wrap">
                <side-menu></side-menu>
            </div>
            <!-- Main Content -->
            <div class="container-fluid">
                <div class="side-body padding-top">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="card card_list">
                                <div class="elm-wrap nav">
                                    <button type="button" class="btn btn-info" onclick="editing('device')">添加设备</button>
                                    <button type="button" class="btn btn-default" onclick="importEx('device')">批量导入</button>
                                    <button type="button" class="btn btn-default" onclick="delingModal('device')">批量删除</button>
                                    <form class="form-inline navbar-right mgr0">
                                        <div class="form-group">
                                          <label for="search_name">设备名称：</label>
                                          <input type="text" id='search_name' class="form-control search_name" placeholder="请输入设备名称">
                                        </div>
                                        <div class="form-group" style="margin-left:10px">
                                            <label for="search_typelist" class="control-label">设备类型： </label>
                                            <select name="search_typelist" id="search_typelist" class="form-control search_typelist" style="width:150px">
                                            </select>
                                        </div>
                                        <div class="form-group" style="margin-left:10px">
                                            <label for="search_grid" class="control-label">设备所在网格： </label>
                                            <select name="search_grid" id="search_grid" class="form-control search_grid">
                                            </select>
                                        </div>
                                        <button type="button" class="btn btn-info" onclick="searching('device')"  style="margin-left:10px">搜索</button>
                                      </form>
                                </div>
                                <div class="elm-wrap people-el">
                                    <div class="alert alert-info" role="alert" style="margin-bottom:0px">
                                            已选择 <span class="dtcount">0</span> 项  |   删除后的数据无法恢复
                                    </div>
                                    <div class="row">
                                        <div class="col-sm-12">
                                            <div>
                                                <div class="card-body">
                                                    <table class="table table-striped quantable" cellspacing="0" width="100%">
                                                        <thead>
                                                            <tr>
                                                                <th class="select-checkbox datatable-checkall">  
                                                                </th>
                                                                <th>设备编号</th>
                                                                <th>设备名称</th>
                                                                <th>设备类型</th>
                                                                <th>设备所在网格</th>
                                                                <th>设备管理部门</th>
                                                                <th>设备维修岗位</th>
                                                                <th>设备巡检岗位</th>
                                                                <th>操作</th>
                                                            </tr>
                                                        </thead>
                                                        <tfoot>
                                                            <tr>
                                                                <th></th>
                                                                <th>设备编号</th>
                                                                <th>设备名称</th>
                                                                <th>设备类型</th>
                                                                <th>设备所在网格</th>
                                                                <th>设备管理部门</th>
                                                                <th>设备维修岗位</th>
                                                                <th>设备巡检岗位</th>
                                                                <th>操作</th>
                                                            </tr>
                                                        </tfoot>
                                                        <tbody>
                                                                
                                                        </tbody>
                                                        
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                     
                                </div> 
                            </div>
                            <div class="card card_edit">
                                <div class=" base_info">
                                    <p class="base_info_p">添加/编辑设备信息</p>
                                    <p class="base_info_ps">根据经纬度确定设备具体位置，只需要输入设备具体的精度纬度，右侧的预览视图会在网格中显示设备具体的位置。</p>
                                    <p class="base_info_ps">手动添加设备具体位置，只需要在右侧预览视图中点击设备所在的大致位置。</p>
                                </div>
                                <div class="row">
                                    <div class="col-sm-6">
                                        <form class="form-horizontal devicevue ss_form" style="margin-top:30px">
                                            <div class="form-group">
                                                <label for="post_name" class="col-sm-3 control-label">设备名称： </label>
                                                <div class="col-sm-9">
                                                    <input type="text" class="form-control devicename" id="devicename" name="devicename" datatype="*" errormsg="请填写正确的设备名称" nullmsg="设备名称是必填的" placeholder="请输入设备名称" v-model="info.devicename">
                                                    <span class='Validform_checktip' />
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="typeid" class="col-sm-3 control-label">设备类型： </label>
                                                <div class="col-sm-9">
                                                    <select class="form-control typeid" name="typeid" id="typeid" style="width:100%" datatype="select2"  errormsg="请选择设备类型" nullmsg="请选择设备类型">
                                                    </select>
                                                    <span class='Validform_checktip' /> 
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="grid" class="col-sm-3 control-label">设备所在网格： </label>
                                                <div class="col-sm-9">
                                                    <select class="form-control grid" name="grid" id="grid" aria-placeholder="请添加所在网格" datatype="select2"  errormsg="请选择所在网格" nullmsg="请选择所在网格" style="width:100%">
                                                    </select> 
                                                    <span class='Validform_checktip' />
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="grid" class="col-sm-3 control-label">设备具体位置： </label>
                                                <div class="col-sm-9">
                                                    <p class="form-control-static">在右侧预览界面确定设备具体位置，获取设备经纬度</p>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="device_y" class="col-sm-3 control-label">经度： </label>
                                                <div class="col-sm-4">
                                                    <input type="text" class="form-control device_x" id="device_x" name="device_x" placeholder="选择经度" datatype="*" errormsg="请点选地图取到正确的经度" nullmsg="请点选地图取到正确的经度">
                                                    <span class='Validform_checktip' />
                                                </div>
                                                <label for="device_x" class="col-sm-1 control-label" style="padding:7px 0px">纬度： </label>
                                                <div class="col-sm-4">
                                                    <input type="text" class="form-control device_y" id="device_y" name="device_y" placeholder="选择纬度"  placeholder="选择纬度" datatype="*" errormsg="请点选地图取到正确的纬度" nullmsg="请点选地图取到正确的纬度">
                                                    <span class='Validform_checktip' />
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="wxwork" class="col-sm-3 control-label">设备维修岗位： </label>
                                                <div class="col-sm-9">
                                                    <select class="form-control wxwork" name="wxwork" id="wxwork" aria-placeholder="设备维修岗位" style="width:100%" datatype="select2"  errormsg="请选择维修岗位" nullmsg="请选择维修岗位" >
                                                    </select> 
                                                    <span class='Validform_checktip' />
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="dep" class="col-sm-3 control-label">启用设备巡检：</label>
                                                <div class="col-sm-9">
                                                    <div class="radio3 radio-check radio-blue radio-inline">
                                                        <input type="radio" id="radio4" v-model="info.isopen" name="isopen" value="1">
                                                        <label for="radio4">
                                                            启用
                                                        </label>
                                                    </div>
                                                    <div class="radio3 radio-check radio-blue radio-inline">
                                                        <input type="radio" id="radio5" v-model="info.isopen" name="isopen" value="0">
                                                        <label for="radio5">
                                                            关闭
                                                        </label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group" v-show="info.isopen == '1'">
                                                <label for="work" class="col-sm-3 control-label">设备巡检岗位： </label>
                                                <div class="col-sm-9">
                                                    <select class="form-control work" name="work" id="work" aria-placeholder="设备巡检岗位" style="width:100%" datatype="select2" errormsg="请选择巡检岗位" nullmsg="请选择巡检岗位">
                                                    </select>
                                                    <span class='Validform_checktip' /> 
                                                </div>
                                            </div>
                                            <div class="form-group" v-show="info.isopen == '1'">
                                                <label for="xjcycle" class="col-sm-3 control-label">设置巡检周期： </label>
                                                <div class="col-sm-9">
                                                    <select class="form-control xjcycle" name="xjcycle" id="xjcycle" aria-placeholder="设置巡检周期" style="width:100%" datatype="select2" errormsg="请选择巡检周期" nullmsg="请选择巡检周期"></select>
                                                    <span class='Validform_checktip' /> 
                                                </div>
                                            </div>
                                            <div class="form-group" v-show="info.isopen == '1'">
                                                <label for="execute" class="col-sm-3 control-label">设置巡检任务 <br/>执行日期： </label>
                                                <div class="col-sm-9">
                                                    <input type="text" placeholder="请选择执行日期" class="form-control execute" id="execute" name="execute" datatype="*" errormsg="执行日期是必填的" nullmsg="执行日期是必填的" >
                                                    <span class='Validform_checktip' />
                                                </div>
                                            </div>
                                            <div class="form-group" style="margin-top:60px">
                                                <div class="col-sm-offset-3 col-sm-9">
                                                    <button type="button" class="btn btn-info edited" onclick="uploadData('device')">确认</button>
                                                    <button type="button" class="btn btn-default edit_cancel">取消</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                    <div class="col-sm-6 map-wrap" style="background-color:#bdbdbd">
                                     <div class="map" id="map" style="width:100%;height:450px"></div>    
                                    </div>
                                </div>
                                
                            </div> 
                        </div>   
                    </div>
                </div>
            </div>
            
            
        </div>
        <footer class="app-footer">
            <div class="wrapper"></div>
        </footer>
        <div class="modal fade" id="modalimport" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">导入</h4>
                    </div>
                    <div class="modal-body">
                        <div class="" style="padding:5px;">
                            <form class="form-horizontal importexform" id="importexform" method="post" action="" enctype="multipart/form-data">
                                    <div class="form-group">
                                        <label for="" class="col-sm-2 control-label">上传模版：</label>
                                        <div class="col-sm-10">
                                            <a href="" class="import-excel" target="_self">下载导入模版</a>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="" class="col-sm-2 control-label">上传文件：</label>
                                        <div class="col-sm-10">
                                            <input type="file" id="exampleInputFile" name="fileToUpload">
                                            <p class="help-block">请下载该模版，并严格遵循该模版规范录入数据。</p>
                                        </div>
                                    </div>
                                </form>
                        </div>    
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-info importbtn">确定</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal fade" id="modalDel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">删除人员</h4>
                    </div>
                    <div class="modal-body">
                        确定删除人员？
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default cancel" data-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-info deling">确认</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal fade" id="modalTips" tabindex="-1" role="dialog" aria-labelledby="myModalLabel3" aria-hidden="true">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel3">提示</h4>
                    </div>
                    <div class="modal-body">
                        温馨提示
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- Javascript Libs -->
<script type="text/javascript" src="../lib/js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/js/common/base.js"></script>
<script type="text/javascript" src="../lib/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../lib/js/bootstrap-switch.min.js"></script>
<script type="text/javascript" src="../lib/js/jquery.matchHeight-min.js"></script>
<script type="text/javascript" src="../lib/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="../lib/js/dataTables.bootstrap.min.js"></script>
<script type="text/javascript" src="../lib/js/select2.full.min.js"></script>
<script type="text/javascript" src="../lib/js/validform.js"></script>
<script type="text/javascript" src="../lib/js/datetimepicker.js"></script>
<script type="text/javascript" src="../lib/js/dataTables.select.min.js"></script>
<!-- <script type="text/javascript" src="../lib/js/depchoice/edep_plugin.js"></script> -->
<script type="text/javascript" src="../lib/js/ztreeJs.js"></script>
<script type="text/javascript" src="../lib/js/vue.js"></script>
<!-- <script type="text/javascript" src="../lib/js/ace/ace.js"></script>
<script type="text/javascript" src="../lib/js/ace/mode-html.js"></script>
<script type="text/javascript" src="../lib/js/ace/theme-github.js"></script> -->
<!-- Javascript -->
<script type="text/javascript" src="../lib/js/common/app.js"></script>
<script type="text/javascript" src="../lib/js/NGR.min.js"></script>
<script>
    navData.accNav1 = 'device'
    navData.nav1Name = '设备管理'
    navData.accNav2 = 'device'
    navData.accNav3 = '6'
    var navVue = new Vue({
        el:'.side-menu-wrap' 
    })
    var navTopVue = new Vue({
        el:'.app-header' 
    })
    var importUrl = {
        file:serverUrl.base+'download/template-new1.xls',
        url:serverUrl.base+serverUrl.device+'DeviceImportSave'
    }
    $('.import-excel').attr('href',importUrl.file)
    $('.importexform').attr('action',importUrl.url)
    var Info={}
    //翻页条件
    var _upData={
        'devicename':$('.search_name').val(),
        'typeid':$('.search_typelist').val() == 'none'?'':$('.search_typelist').val(),
        'grid':$('.search_grid').val() == 'none'?'':$('.search_grid').val(),
        'page':1
    }
    var _dataTable = $('.quantable').DataTable({
        "dom": 'rt<"bottom"ip<"clear">>',
        language:{
            url: '../lib/js/cn_lang.json'
        },
        serverSide:true,
        ajax:function(data,callback,settings){
            //console.log('data',data)
            _upData.page = (data.start / data.length)+1;//当前页码
            $.ajax({
                url:serverUrl.base+serverUrl.device+'device_list',
                type:"POST",
                data:_upData,
                cache: false,
                dataType:"json",
                success:function(res){
                    if(res.code == 0){
                        // $('.tablepagewrap').html(res.result_page)
                        res.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                        res.recordsTotal = res.total;//返回数据全部记录
                        res.recordsFiltered = res.total;//后台不实现过滤功能，每次查询均视作全部结果
                        callback(res)
                    }        
                },
                complete:function(res){
                    $('body').loading('close')
                },
                error:function(res){
                    
                }    
            })
        },
        select:'multi',
        ordering:false,
        buttons:['colvis','excel', 'print','selectAll'],
        columns:[
            {"data":null,defaultContent:'',className: 'select-checkbox'},
            { "data": "device_id",defaultContent:'' },
            { "data": "device_name",defaultContent:'' },
            { "data": "device_type_name",defaultContent:'' },
            { "data": "grid_name",defaultContent:'' },
            { "data": "department_name",defaultContent:'' },
            { "data": "wx_post_name",defaultContent:'' },
            { "data": "xj_post_name",defaultContent:''},
            {
                "data":null,render:function(data, type, row, meta){
                    return '<a onclick="editing(\'device\',this)" href="javascript:void(0)">编辑</a> <a onclick="delingModal(\'device\',this)" href="javascript:void(0)">删除</a>'
                },defaultContent:''
            }
            
        ]  
    })
    _dataTable.on('select.dt',function(){
        var selected = _dataTable.rows( { selected: true } ).count()
        var _rows =  _dataTable.rows().count()
        $('.dtcount').text(selected)
        _rows == selected?$('.datatable-checkall').addClass('selected'):$('.datatable-checkall').removeClass('selected')
    })
    _dataTable.on('deselect.dt',function(){
        var selected = _dataTable.rows( { selected: true } ).count()
        $('.dtcount').text(selected)
        $('.datatable-checkall').removeClass('selected')
    })
    $('.datatable-checkall').click(function(){
        $(this).toggleClass('selected')
        if($(this).hasClass('selected')){
            _dataTable.rows().select()
        }else{
            _dataTable.rows().deselect()
        }
        
    })
    // $('.quantable').on('init.dt',function(res){
    //     console.log(res)
    // })
    
    // function ajax_data(page){
    //     var _page = page
    //     _upData={
    //         'devicename':$('.search_name').val(),
    //         'typeid':$('.search_typelist').val() == 'none'?'':$('.search_typelist').val(),
    //         'grid':$('.search_grid').val() == 'none'?'':$('.search_grid').val(),
    //         'page':_page
    //     }
    //     // _dataTable.settings()[0].ajax.data=_upData
    //     _dataTable.ajax.reload()
    // }
    function searching(name){
        switch(name){
            case 'device':
                _upData={
                    'devicename':$('.search_name').val(),
                    'typeid':$('.search_typelist').val() == 'none'?'':$('.search_typelist').val(),
                    'grid':$('.search_grid').val() == 'none'?'':$('.search_grid').val()
                }
                //_dataTable.settings()[0].ajax.data=_upData
                _dataTable.ajax.reload()
            break;
        }
    } 

    function importExCancel(){
        $('.card_error').hide()
        $('.card_error').find('.errortable tbody tr').remove()
        $('.card_list').show()
    }        
    //批量导入
    function importEx(type){
        var $modal = $('#modalimport')
        $modal.find('#exampleInputFile').val('')
        var _txt = {
            tit:'批量导入'
        }
        switch(type){
            case 'people':
                _txt.tit = '批量导入人员'
            break;
            case 'device':
                _txt.tit = '批量导入设备'
            break;
        }
        $modal.find('.modal-title').text(_txt.tit) 
        $modal.modal()
        $('.importbtn').off('click').on('click',function(){
            
            var formDataPic = new FormData(document.getElementById('importexform'))
            console.log($('.importexform').val())
            var excel=['application/vnd.openxmlformats-officedocument.spreadsheetml.sheet','application/vnd.ms-excel']
            var fileType = String(document.getElementById('exampleInputFile').files[0].type)
            if(excel[0] == fileType || excel[1] == fileType){
                $modal.modal('hide')
                $('.card_list').loading('open')
                $.ajax({
                    url:importUrl.url,
                    type:"POST",
                    data:formDataPic,
                    cache: false,
                    contentType: false,  
                    processData: false,
                    beforeSend:function (returndata){
                        //dd.show()
                    },
                    dataType:"json",
                    success:function(res){
                        var _txt={
                            tit:'提交成功',
                            info:res.info
                        }
                        if(res.code == 0){
                            //更新表格
                            // _dataTable.settings()[0].ajax.data={'department_id':Info.department_id}
                            // _dataTable.ajax.reload()
                            
                            if(Info.row){
                                Info.row.deselect();
                                _dataTable.ajax.reload()
                            }else{
                                _dataTable.ajax.reload()
                            }
                            Info = {}
                            $('.card_edit').hide()
                            $('.card_list').show()
                        }else if(res.code == '1'){
                            // $('.card_error').show()
                            // $('.card_list').hide()
                            $('.card_edit').hide()
                            $('.card_list').show()
                            _txt.tit = '提交失败' 
                        }else{
                            _txt.tit = '提交失败'
                            _txt.info = '未知错误，请联系开发商'
                        }
                        setTimeout(function(){
                            $("#modalTips").find('.modal-title').text(_txt.tit) 
                            $("#modalTips").find('.modal-body').text(_txt.info)
                            $("#modalTips").modal()    
                        },500)

                    },
                    complete:function(res){
                        $('.card_list').loading('close')
                    },
                    error:function(res){
                        $("#modalTips").find('.modal-title').text('出现问题') 
                        $("#modalTips").find('.modal-body').text(res.info)
                        setTimeout(function(){
                            $("#modalTips").modal()    
                        },500)
                    }    
                })
            }else{
                // $("#modalTips").find('.modal-title').text('提交失败') 
                // $("#modalTips").find('.modal-body').text('您提交的文件格式不对')
                // $("#modalTips").modal() 
                $modal.find('#exampleInputFile').val('')
                alert('文件格式不对！')
            } 
        })           
    }
    var deviceVue = new Vue({
        el:".devicevue",
        data:{
            count:0,
            info:{
                devicename:'',
                isopen:'0',
                deviceid:null,
                smile_grid:''
            }
        },
        computed:{
        },
        methods:{
        },
        created:function(){
            
        },
        mounted:function(){
            newSelectDevice();
        },
        beforeUpdate:function(){
        },
        updated:function(){          
        },
        watch:{
        }
    })
    //编辑
    function editing(name,elm){
        Info={}
        switch(name){
            case 'device':
                $('.card_edit').show()
                $('.card_list').hide()
                //地图渲染
                res.requestMaps().then(function (maps) {
                    res.requestPOIChildren(maps.list[0].poi).then(function (floors) {                      
                        // 将楼层数据设置给楼层控件
                        control.setFloorList(floors); 
                        // 设置当前显示的楼层
                        control.setCurrentFloor(floors[1].id, loadPlanarGraph);

                    }).fail(function (e) {
                        return console.error(e, e.stack);
                    });
                }).fail(function (e) {
                    return console.error(e, e.stack);
                });

                Info = {
                    device_name:"",
                    device_id:null,
                    device_type_id:"",
                    is_open:"0",
                    device_type_id:"",
                    grid_id:"",
                    device_x:"",
                    device_y:"",
                    wx_post_id:"",
                    xj_post_id:"",
                    xj_cycle:"",
                    execute:"",
                    smile_grid:''

                }
                if(marker != ''){
                    markerlayer.removeLayer(marker)
                }
                if(arguments[1]){
                    Info = $.extend({},Info,_dataTable.row($(elm).parents('tr')).data())
                }else{
                }
                deviceVue.info.devicename=Info.device_name //设备名字
                deviceVue.info.deviceid=Info.device_id //设备id
                deviceVue.info.isopen=Info.is_open //是否开启巡检
                $('.typeid').val(Info.device_type_id).trigger('change')
                $('.grid').val(Info.grid_id).trigger('change');
                $('.device_x').val(Info.device_x)
                $('.device_y').val(Info.device_y)
                $('.wxwork').val(Info.wx_post_id).trigger('change')
                $('.work').val(Info.xj_post_id).trigger('change')
                $('.xjcycle').val(Info.xj_cycle).trigger('change')
                $('.execute').val(Info.execute)
            break;
            default:
                $('.card_edit').show()
                $('.card_list').hide()
                Info = {}
            break;
        }
        if(arguments[1]){
            Info.row = $(elm).parents('tr')
        }
    }
    //删除
    function delingModal(name,elm){
        var _text={
            tit:'删除',
            body1:'确定删除吗？',
            body2:'删除出现问题',
            btn1:'确定',
            cbtn1:'取消',
            cbtn2:'知道了',
            deltit1:'删除成功',
            deltit2:'删除失败',
            delbody1:"删除成功！",
            delbody2:"出现问题",
        },_datas={
            id:'',
            data:{},
            url:''
        }
        switch(name){
            case 'device':
                if(arguments[1]){
                    Info.row = $(elm).parents('tr')
                    _datas.data={
                        deviceid:[_dataTable.row(Info.row).data().device_id]
                    }
                    _text.body1 = '确定删除该设备么？'
                }else{
                    var _tempDatas = _dataTable.rows({selected:true}).data()
                    _datas.data.deviceid=[]  
                    for(var i=0;i<_tempDatas.length;i++){
                        _datas.data.deviceid.push(_tempDatas[i].device_id)
                    }
                    _text.body1 = '确定删除这些设备么？'
                }

                _datas.url = serverUrl.base+serverUrl.device+'del_device'
                _text.tit = '删除设备'
                $('#modalDel').find('.modal-title').text(_text.tit)
                $('#modalDel').find('.modal-body').text(_text.body1)
                $('#modalDel').modal()
            break;
            default:
            break;
        }
        $('.deling').off('click').on('click',function(){
            $('.card_list').loading('open')
            $.post(_datas.url,_datas.data,function(res){
                $('#modalDel').modal('hide')
                if(res.code == 0){
                    setTimeout(function(){
                        $('#modalTips').find('.modal-body').text(_text.deltit1)
                        $("#modalTips").modal()    
                    },500)
                    if(Info.row){
                        _dataTable.row(Info.row).remove().draw(false)
                    }else{
                        _dataTable.rows({selected:true}).remove().draw(false)
                    }
                    
                }else{
                    setTimeout(function(){
                        $('#modalTips').find('.modal-body').text(_text.deltit2)
                        $("#modalTips").modal()    
                    },500)
                }
            },'json').error(function(res){
                $('#modalDel').modal('hide')
                setTimeout(function(){
                    $('#modalTips').find('.modal-body').text(_text.delbody2)
                    $("#modalTips").modal()    
                },500)
            }).complete(function(){
                $('#modalDel').modal('hide')
                $('.card_list').loading('close')
            })
        })
        
    }  
        
    //提交 
    function uploadData(name){
        switch(name){
            case 'device':
            var _dataTableRow=_dataTable.row(Info.row)
            var _upData = deviceVue.info
            if(_upData.isopen == '0'){
                myValidform.ignore($('.work'))
                myValidform.ignore('.xjcycle')
                myValidform.ignore('.execute')
            }else{
                myValidform.unignore('.work')
                myValidform.unignore('.xjcycle')
                myValidform.unignore('.execute')
            }
            
            if(!myValidform.check()){
                return false
            }
            
            //console.log(_upData)
            var upData={
                devicename:_upData.devicename,
                typeid:$('select[name=typeid]').val(),
                grid:$('select[name=grid]').val(),
                smilegrid:Info.smile_grid,
                device_x:$('input[name=device_x]').val(),
                device_y:$('input[name=device_y]').val(),
                workid:_upData.isopen == '1'?$('select[name=work]').val():'',
                workname:_upData.isopen == '1'?$('select[name=work]').select2('data')[0].text:'',
                wxworkid:$('select[name=wxwork]').val(),
                wxworkname:$('select[name=wxwork]').select2('data')[0].text,
                isopen:_upData.isopen,
                xjcycle:_upData.isopen == '1'?$('select[name=xjcycle]').val():'',
                execute:_upData.isopen == '1'?$('input[name=execute]').val():''
            }
            if(_upData.deviceid && _upData.deviceid != null){
                upData.deviceid = _upData.deviceid
            }
            //console.log(upData)
            $('.card_edit').loading('open')
            $.ajax({
                url:serverUrl.base+serverUrl.device+'add_device',
                type:"POST",
                data:upData,
                dataType:"json",
                success:function(res){
                    if(res.code == 0){
                        //更新表格
                        // _dataTable.settings()[0].ajax.data={'department_id':Info.department_id}
                        _dataTable.ajax.reload(function(){},false)
                        var _info='',_text='添加成功'
                        if(Info.row){
                            _dataTableRow.deselect();
                            _info = '设备修改成功！'
                            _text = '修改成功'
                        }else{
                            _info = '设备添加成功！'
                        }
                        $("#modalTips").find('.modal-title').text(_text) 
                        $("#modalTips").find('.modal-body').text(_info)
                        $('.card_edit').hide()
                        $('.card_list').show()
                    }else if(res.code == '2'){
                        $("#modalTips").find('.modal-title').text('出现问题') 
                        $("#modalTips").find('.modal-body').text(res.info)
                    }
                    setTimeout(function(){
                        $("#modalTips").modal()   
                        $("#modalTips").find('.modal-body').text(res.info) 
                    },500)
                },
                complete:function(res){
                    $('#modalDel').modal('hide')
                    $('.card_edit').loading('close')
                },
                error:function(res){
                    $("#modalTips").find('.modal-title').text('出现问题') 
                    $("#modalTips").find('.modal-body').text(res.info)
                    setTimeout(function(){
                        $("#modalTips").modal()    
                    },500)
                }    
            })
            break;
        }
    }
    //取消
    $('.edit_cancel').on('click',function(){
        Info.row && _dataTable.row(Info.row).deselect()
        Info={}
        $('.card_edit').hide()
        $('.card_list').show()
    })
    var myValidform = $(".ss_form").Validform({
        tiptype:3,
        datatype:{
            putso:function(gets,obj,curform,regxp){
                /*参数gets是获取到的表单元素值，
				  obj为当前表单元素，
				  curform为当前验证的表单，
				  regxp为内置的一些正则表达式的引用。*/
                var _checkpwrap = obj.parents('.checkpwrap')
                var _type = _checkpwrap.find('.checkp').val()
                var _userid = _checkpwrap.find('.userid').val()
                var _post = _checkpwrap.find('.post').val()
                var reg1=regxp["*"],
					reg2=/[\d]{7}/,
					mobile=curform.find(".mobile");
                if(_type == '1'){
                    //人
                    console.log(_userid)
                    if(reg1.test(_userid)){return true;}
                }else if(_type == '3'){
                    //岗位
                    if(reg1.test(_post)){return true;}
                }
                return false;
            },
            ztreegroup:function(gets,obj,curform,regxp){
                console.log(gets)
                if(gets == ''){
                    return false
                }else{
                }
            },
            select2:function(gets,obj,curform,regxp){
                if(gets.length ==0){
                    obj.siblings('.select2').find('.select2-selection').css('borderColor','red')
                    return false
                }else{
                    obj.siblings('.select2').find('.select2-selection').css('borderColor','#ccc')
                }
            }
        }
    });

    // $(document).on('click','.treegroup',function(){
    //     showsDeptWin(null,'select','dep','depid','emp','single',myValidform);
    // })
   
    function newSelectDevice(ids){
        setTimeout(function(){
            $(".execute").datetimepicker({
                timepicker: false,
                format:'Y-m-d',
                minDate:'-1969/12/31'
            }); 
        },0)
          
        var select = new rpSelect({
            sel:'typeid',
            url:serverUrl.base + serverUrl.device + 'type_list',
            valide:myValidform,
            multiple:false,
            placeholder:'请选择设备类型'
        })
        var selectGrip = new rpSelect({
            sel:'grid',
            url:serverUrl.base+serverUrl.grid+'grid_choice_list',
            multiple:false,
            placeholder:'请选择所在网格'
        })
        
        var selectWxwork = new rpSelect({
            sel:'wxwork',
            data:{post_duty:'1'},
            url:serverUrl.base + serverUrl.post + 'post_list',
            valide:myValidform,
            multiple:false,
            placeholder:'请选择设备的维修岗位'
        })
        var selectWork = new rpSelect({
            sel:'work',
            url:serverUrl.base + serverUrl.post + 'post_list',
            data:{post_duty:'1'},
            valide:myValidform,
            multiple:false,
            placeholder:'请选择设备的巡检岗位'
        })
        var selectXjwork = new rpSelect({
            sel:'xjcycle',
            datas:select2Datas.xjcycle,
            valide:myValidform,
            multiple:false,
            placeholder:'请选择设备的巡检周期'
        })
    }
    new rpSelect({
        sel:'search_typelist',
        url:serverUrl.base+serverUrl.device+'type_list',
        multiple:false,
        hasAll:true,
        placeholder:'选择设备类型'
    })
    new rpSelect({
        sel:'search_grid',
        url:serverUrl.base+serverUrl.grid+'grid_choice_list',
        multiple:false,
        hasAll:true,
        placeholder:'选择责任网格'
    })
    
    var _hostName=''
    if(/10.78.153/.test(host_name)){
       _hostName ='http://10.78.153.165:58080'
    }else if(/10.87.140/.test(host_name)){
       _hostName = 'http://10.87.140.205:58080'
    }else if(/119.23.232/.test(host_name)){
         _hostName = ''
    }else{
         _hostName = ''
    }
    window.map = new NGR.View('map', {
        appKey: "73f05e8ba965437e8b58397259280e0a",
        scrollWheelZoom:"center",
        server:_hostName
    });
    window.res = new NGR.DataSource({
        appKey: "73f05e8ba965437e8b58397259280e0a",
        server:_hostName
    });
    window.control = NGR.control.floor();
    window.layers = {}
    var marker=''
    window.markerlayer = NGR.layerGroup()
    // 初始化楼层控件，并将楼层空间加入到地图种
    map.addControl(control); 
    // 设置楼层切换时的回调
    control.on('change', function (e) { 
        control.setCurrentFloor(e.to, loadPlanarGraph);
    });
    var _floorId =[]
    // res.requestMaps().then(function (maps) {
    //     res.requestPOIChildren(maps.list[0].poi).then(function (floors) {
    //         //取到该地图所有楼层的id数据
    //         for (var i = 0; i < floors.length; i++) {
    //             _floorId.push(floors[i].id)
    //         }
    //         loadPlanarGraph(floors[0].id)

    //     }).fail(function (e) {
    //         return console.error(e, e.stack);
    //     });
    // }).fail(function (e) {
    //     return console.error(e, e.stack);
    // });
    //渲染地图图层
    window.loadPlanarGraph = function (planarGraphId) {
        return res.requestPlanarGraph(planarGraphId).then(function (layerInfo) {
            // console.log(layerInfo);
            var lastLayer = null;
            //console.log(map)
            return NGR.IO.fetch({
                url: '../lib/json/style.json',
                onsuccess: JSON.parse
            }).then(function (style) {
               map.clear();
                layers.frame = NGR.featureLayer(layerInfo, {
                    layerType: 'Frame',
                    styleConfig: style
                });
                layers.area = NGR.featureLayer(layerInfo, {
                    layerType: 'Area',
                    styleConfig: style
                });
                layers.annotation = NGR.featureLayer(layerInfo.Area, {
                    layerType: 'LogoLabel',
                    styleConfig: style
                });
                layers.facility = NGR.featureLayer(layerInfo.Facility, {
                    layerType: 'Facility',
                    styleConfig: style
                });

                layers.collision = NGR.layerGroup.collision({
                    margin: 3
                });
                layers.collision.addLayer(layers.annotation);
                layers.collision.addLayer(layers.facility);

                map.addLayer(layers.frame);
                map.addLayer(layers.area);
                map.addLayer(layers.collision);
                map.addLayer(markerlayer)
                map.render();
                if($('.ngr-bottom.ngr-right').length != 0){
                    $('.ngr-bottom.ngr-right').remove()
                }
                layers.area.eachLayer(function (layer) {
                  layer.on('click', function (e) {
                      Info.smile_grid=e.target.feature.id
                      //alert(e.target.feature.id)
                  }) 
                  })   
            }).fail(function (e) {
                return console.error(e, e.stack);
            });
        }).fail(function (e) {
            return console.error(e, e.stack);
        });
    }
    map.on('click',function(e){
        markerlayer.clearLayers()
        $('.device_y').val(e.latlng.lat).trigger('blur')
        $('.device_x').val(e.latlng.lng).trigger('blur')
        marker = NGR.marker(e.latlng,{
            icon: NGR.icon({
                iconUrl: '../lib/img/1.png',
                iconSize: [24, 24]
            }),
            riseOnHover: true});
        markerlayer.addLayer(marker)
    })
</script>
</body>

</html>
